Estoy tratando de hacer que cuando un control deslizante de rango aumente desde un valor inicial (mínimo) de 0.5 y un valor final (máximo) de 1, el valor de salida convertido disminuya desde un punto inicial de 1 (cuando el control deslizante está en 0.5) y luego disminuyendo a 0 (cuando el control deslizante está en 1)
Esto es lo que he intentado, actualmente la salida de inicio del número convertido es correcta en 1, pero al aumentar el control deslizante, ¡se supone que debe bajar, no subir!
updatefaderval(); function updatefaderval() { var rangeval = document.getElementById('fader').value; document.getElementById('faderval').innerText = rangeval; document.getElementById('convertedval').innerText = convert(rangeval); } function convert(inputval) { var aMin = 0.5; var aMax = 1; var bMin = 1; var bMax = 0; var aValue = inputval; var percentage = aValue / ( aMax - aMin ); var outputvalue = bMax - percentage * (bMax - bMin); console.log(percentage); return outputvalue; } <input id="fader" oninput="updatefaderval();" type="range" min="0.5" max="1" step="0.01" value="0.5" style="display:block"> Slider Actual Value: <span style="display:inine-block" id="faderval"></span><br /> Converted Value: <span style="display:inine-block" id="convertedval"></span>Cuando configuré el bMin en 1 y el bMax en 0, pensé que esto tendría el resultado deseado, ¡pero lamentablemente no!
Aquí está la fórmula que podrías usar:
updatefaderval(); function updatefaderval() { var range = document.getElementById('fader'); document.getElementById('faderval').innerText = range.value; document.getElementById('convertedval').innerText = convert(+range.value, +range.min, +range.max, 1, 0); } function convert(inputval, srcStart, srcEnd, destStart, destEnd) { return destStart + (inputval - srcStart) * (destEnd - destStart) / (srcEnd - srcStart); } <input id="fader" oninput="updatefaderval();" type="range" min="0.5" max="1" step="0.01" value="0.5" style="display:block"> Slider Actual Value: <span id="faderval"></span><br> Converted Value: <span id="convertedval"></span>